<template>
  <div class="box-bpdy box-primary">
    <div class="form-horizontal">
      <div class="box-body">
        <div class="form-group">
          <label class="col-md-3 control-label my-label">角色名称:</label>
          <div class="col-sm-9">
            <el-input v-model="name" placeholder="请输入角色名称" :disabled="isReadOnly"></el-input>
          </div>
        </div>
        <div class="form-group">
          <label class="col-md-3 control-label my-label">功能授权:</label>
          <div class="col-sm-9">
            <el-select v-model="roles" multiple placeholder="请选择">
              <el-option
                v-for="item in functions"
                :key="item.id"
                :label="item.name"
                :value="item.id">
              </el-option>
            </el-select>
          </div>
        </div>
        <div class="form-group">
          <label class="col-md-3 control-label my-label">数据授权:</label>
          <div class="col-sm-9">
            <el-select v-model="query" placeholder="请选择">
              <el-option
                v-for="item in dataPrivs"
                :key="item.id"
                :label="item.name"
                :value="item.id">
              </el-option>
            </el-select>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import RestApi from "../../../common/restapi";
import multiselect from "vue-multiselect";
export default {
  name: "roleEdit",
  props: ["role"],
  data() {
    return {
      isReadOnly: false,
      name: "",
      query: 1,
      roles: [0],
      reportPrivs: [{ id: 1, name: "基本报表" }, { id: 2, name: "高级报表" }],
      dataPrivs: [
        { id: 0, name: "限看本人数据" },
        { id: 1, name: "限查看本部门数据" },
        { id: 2, name: "限查看除中心领导外数据" },
        { id: 3, name: "允许查看所有数据" }
      ],
      functions: [
        { id: 0, name: "基础权限" },
        { id: 1, name: "修改权限" },
        { id: 2, name: "审核权限" },
        { id: 4, name: "管理权限" },
        { id: 8, name: "首页权限" },
        { id: 16, name: "填报权限" },
        { id: 32, name: "月报权限" },
        { id: 64, name: "汇总权限" },
      ]
    };
  },
  created: function() {
    if (this.role) {
      this.name = this.role.name;
      this.query = this.role.query;
      this.roles = [0];
      if ((this.role.roles & 1) == 1) {
        this.roles.push(1);
      }
      if ((this.role.roles & 2) == 2) {
        this.roles.push(2);
      }
      if ((this.role.roles & 4) == 4) {
        this.roles.push(4);
      }
      if ((this.role.roles & 8) == 8) {
        this.roles.push(8);
      }
      if ((this.role.roles & 16) == 16) {
        this.roles.push(16);
      }
      if ((this.role.roles & 32) == 32) {
        this.roles.push(32);
      }
      if ((this.role.roles & 64) == 64) {
        this.roles.push(64);
      }
    }
  },
  mounted: function() {},
  methods: {
    getRole() {
      var roles = 0;
      for (var item in this.roles) {
        roles = roles | this.roles[item];
      }
      if (this.role) {
        return {
          id: this.role.id,
          name: this.name,
          query: this.query,
          roles: roles
        };
      } else
        return {
          name: this.name,
          query: this.query,
          roles: roles
        };
    }
  }
};
</script>

